<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>点设设计公司-首页</title>
		<link rel="stylesheet" href="css/base.css" />
		<link rel="stylesheet" href="css/home.css" />
		<script src="//unpkg.com/vue/dist/vue.js"></script>
	    <script src="//unpkg.com/element-ui@2.0.9/lib/index.js"></script>
		<link  href="images/favicon.png" rel="icon"/>
		<script type="text/javascript"> 
			function showImg(){ 
			document.getElementById("wxImg").style.display='block'; 
			} 
			function hideImg(){ 
			document.getElementById("wxImg").style.display='none'; 
			} 
		</script>
		<style>
		@import url("//unpkg.com/element-ui@2.0.8/lib/theme-chalk/index.css");
		.el-carousel__item h3 {
		font-size: 14px;
		line-height: 150px;
		margin: 0;
	    }
	   .banner:nth-child(1){
		width: 100%;
		background: url(images/index_banner_01.jpg) no-repeat 200px;
	    -webkit-background-size: cover !important;
		height: 700px;
		text-align: center;
		background-position: -70% 0;
		position: relative;
		font-size: normal;
		z-index:1;
		background-attachment: fixed;
	    }
	    .banner1{
		width: 100%;
		background: url(images/bg4.jpg) no-repeat 200px;
	    -webkit-background-size: cover !important;
		height: 700px;
		text-align: center;
		background-position: -70% 0;
		position: relative;
		font-size: normal;
		z-index:1;
		background-attachment: fixed;
	   }
	   .banner2{
		width: 100%;
		background: url(images/bg2.jpg) no-repeat 200px;
	    -webkit-background-size: cover !important;
		height: 700px;
		text-align: center;
		background-position: -70% 0;
		position: relative;
		font-size: normal;
		z-index:1;
		background-attachment: fixed;
	   }
	   .nav{
	   width: 1300px;
	   height: 700px;
	   margin: 0px auto;
	   }
	   .nav .logo{
	   margin-left: 60px;
	   margin-top: 20px;
	   }
	   .banner .jiantou{
	   position: absolute;
	   bottom: 80px;
	   left: 50%;
	   animation:dong 2.5s ease-in-out infinite ;
       }
       .banner .jiantou img{
	   width: 60px;
       }
       .banner1 .jiantou{
	   position: absolute;
	   bottom: 80px;
	   left: 50%;
	   animation:dong 2.5s ease-in-out infinite ;
       }
       .banner1 .jiantou img{
	   width: 60px;
       }
       .banner1 .content{
       position: absolute;
       bottom: 220px;
       left: 10%;
       }
       .banner1 .content img{
       width: 1100px;
       }
       .banner2 .jiantou{
	   position: absolute;
	   bottom: 80px;
	   left: 50%;
	   animation:dong 2.5s ease-in-out infinite ;
       }
       .banner2 .jiantou img{
	   width: 60px;
       }
       .banner2 .content{
       position: absolute;
       bottom: 220px;
       left: 30%;
       }
       .banner2 .content img{
    	width: 600px;
       }
       </style>
	</head>
	<body>
		<div class="back_top">
				<a href="#">
					<img src="images/top2.png" />
				</a>
			</div>
			<div class="messeage">
				<a href="http://wpa.qq.com/msgrd?v=3&uin=643879871&site=qq&menu=yes">
					<img src="images/Online.gif" />
				</a>
			</div>
		<div id="app" style="height: 700px;">
		<template>
			<div class="block">
				<el-carousel trigger="click" height="700px">
					<el-carousel-item v-for="item in 1" :key="item">
						<div class="banner">
							<div class="jiantou">
								<img src="images/jiantou.png" />
							</div>
							<div class="nav">
								<div class="logo fl">
									<a href="index.html">
										<img src="images/diansheLOGO.png" />
									</a>
								</div>
								<div class="tell fr">
									<a href="#">
										<img src="images/phone.png" />
									</a>
								</div>
								<ul class="fr">
									<li>
										<a href="project.html">案例</a>
									</li>
									<li>
										<a href="service.html">服务</a>
									</li>
									<li>
										<a href="about.html">关于</a>
									</li>
									<li>
										<a href="news.html">研究</a>
									</li>
								</ul>
							</div>
						</div>
					</el-carousel-item>
					<el-carousel-item v-for="item in 1" :key="item">
						<div class="banner1">
							<div class="content">
								<img src="images/bg3-1.png" />
							</div>
							<div class="jiantou">
								<img src="images/jiantou.png" />
							</div>
							<div class="nav">
								<div class="logo fl">
									<a href="index.html">
										<img src="images/diansheLOGO.png" />
									</a>
								</div>
								<div class="tell fr">
									<a href="#">
										<img src="images/phone.png" />
									</a>
								</div>
								<ul class="fr">
									<li>
										<a href="project.html">案例</a>
									</li>
									<li>
										<a href="service.html">服务</a>
									</li>
									<li>
										<a href="about-1.html">关于</a>
									</li>
									<li>
										<a href="news.html">新闻</a>
									</li>
								</ul>
							</div>
						</div>
					</el-carousel-item>
					<el-carousel-item v-for="item in 1" :key="item">
						<div class="banner2">
							<div class="content">
								<img src="images/bg2-1.png" />
							</div>
							<div class="jiantou">
								<img src="images/jiantou.png" />
							</div>
							<div class="nav">
								<div class="logo fl">
									<a href="index.html">
										<img src="images/diansheLOGO.png" />
									</a>
								</div>
								<div class="tell fr">
									<a href="#">
										<img src="images/phone.png" />
									</a>
								</div>
								<ul class="fr">
									<li>
										<a href="project.html">案例</a>
									</li>
									<li>
										<a href="service.html">服务</a>
									</li>
									<li>
										<a href="about-1.html">关于</a>
									</li>
									<li>
										<a href="news.html">新闻</a>
									</li>
								</ul>
							</div>
						</div>
					</el-carousel-item>
				</el-carousel>
			</div>
		</template>
	</div>
		<div class="index-box mr">
			<!--<div class="bg clearfix">
				<div class="banner clearfix">
					<div class="cnt-img">
						<div class="year"></div>
					</div>
					<div class="jiantou">
						<img src="images/jiantou.png" />
					</div>
					<div class="nav">
						<div class="logo fl">
							<a href="index.html">
								<img src="images/diansheLOGO.png" />
							</a>
						</div>
						<div class="tell fr">
							<a href="#">
								<img src="images/phone.png" />
							</a>
						</div>
						<ul class="fr">
							<li>
								<a href="#">案例</a>
							</li>
							<li>
								<a href="#">服务</a>
							</li>
							<li>
								<a href="#">关于</a>
							</li>
							<li>
								<a href="#">新闻</a>
							</li>
						</ul>
					</div>
			    </div>
			</div>-->
			<div class="about clearfix">
				<div class="title">
					<img src="images/icon_01.png" />
					<p class="txt">ABOUT NICE</p>
					<p class="txt1">关于我们</p>
				</div>
				<div class="content clearfix">
					<div class="content1">
						<p class="fl">背景</p>
						<span class="fl">INNOVATIVE FEATURES</span>
					</div>
					<div class="content2 clearfix">
						<p class="fl">理念</p>
						<span class="fl">由2010年于合肥成立的点设设计公司。一直<br />
以来，set point致力于为所有企业提供用户<br />
界面设服务。当您第一次知道set point的时<br />候，我...
</span>
					</div>
					<div class="content3 clearfix">
						<p class="fl">历程</p>
						<span class="fl">Lorem ipsum dolor sit amet,consectetur adipis<br />
icing eilt,sed do eiusmod tempor. incididunt la<br />
bore et dolore magna alique.UTenim ad minim<br />
veniam qus..</span>
					</div>
				</div>
				<div class="login">
					<a href="#">
						<span>View details</span>
						<img src="images/icon_03.png" />
					</a>
				</div>
			</div>
			<div class="project">
				<div class="project-title">
					<img src="images/project.jpg" class="fl"/>
					<span class="wenzi fr">项目案例</span>
				</div>
				<div class="project-content">
					<div class="project-content1">
						<img src="images/index_project_04.jpg"/>
					</div>
					<div class="project-content2">
						<img src="images/index_project_01.jpg" class="pic1" />
						<div class="tile">
							<div class="text">
								<h1>Wo Kai Shi</h1>
								<img src="images/index_project_02.jpg" />
								<h2 class="animate-text">More lorem ipsum bacon ipsum.</h2>
								<p class="animate-text">Bacon ipsum dolor amet pork belly tri-tip turducken, pancetta bresaola pork chickenmeatloaf. Flank sirloin strip steak prosciutto kevin turducken. </p>
								<div class="dots">
									<span></span> <span></span> <span></span> 
								</div>
							</div>
						</div>
						<img src="images/index_project_03.jpg" class="pic3"/>
						<div class="pic4"></div>
					</div>
					<div class="project-content3">
						<div class="title">
							<p>INTORDUCTION</p>
							<p>OF WORKS</p>
						</div>
						<div class="cnt">
							<p class="p1">Brief introduction</p>
							<p class="p2">我开始健身pad端app由nicedesign设计打造，我开始健身是一个新型的互动网络平台，鼓人们积极开创健康向上的美好生活。可以跟视频做运动，同时获取积分，也可以分享运动视频给我的好友。在这里，你可以体验最潮的健身动作，收获最棒的运动心态！ </p>
						</div>
					</div>
				</div>
				<div class="project1-content">
				    <img src="images/index_project_07.png" class="pic1"/>
				    <img src="images/index_project_06.jpg" class="pic2"/>
				    <img src="images/index_project_08.jpg" class="pic3"/>
				    <div class="pic4"></div>
				    <div class="title">
						<p>INTORDUCTION</p>
						<p>OF WORKS</p>
					</div>
					<div class="cnt">
						<p class="p1">Brief introduction</p>
						<p class="p2">我开始健身pad端app由nicedesign设计打造，我开始健身是一个新型的互动网络平台，鼓人们积极开创健康向上的美好生活。可以跟视频做运动，同时获取积分，也可以分享运动视频给我的好友。在这里，你可以体验最潮的健身动作，收获最棒的运动心态！ </p>
					</div>
					<div class="more">
					    <a href="#">
					    	<span>View details</span><img src="images/icon_03.png" />
					    </a>
					</div>
				</div>
			</div>
			<div class="learn">
				<div class="content">
					<div class="title">
						<p class="p1">We are designers, engineer, visionary</p>
						<p class="p2">Your user experience expert, too</p>
						<p class="p3">点设公司成立于2010年，我们是一家专注用户体验与互联网品牌建设的设计公司，创立至今为200多位客户提供了创</p>
						<p class="p4">新与专业的设计方案，设计服务范围包括：交互原型设计、网站设计与开发建设移动及软件产品界面设计、品牌及平</p>
						<p class="p4">面设计等。我们的价值与宗旨是只为用户和客户打造最nice的设计、用设计提升产品和企业价值。</p>
					</div>
					<div class="button">
						<div class="zixun fl">
							<a href="#">
								<span>咨询我们</span>
							</a>
						</div>
						<div class="liaojie fr">
							<a href="#">
								<span>了解更多</span>
							</a>
						</div>
					</div>
				</div>
			</div>
			<div class="they">
				<div class="title">
					<p>They choose</p>
					<a href="#">全部客户列表>></a>
				</div>
				<ul class="content">
					<li style="margin-left:0px;">
						<a href="#">
							<img src="images/kehu-1.png"  onMouseOver="this.src='images/1.jpg'" onMouseOut="this.src='images/kehu-1.png'"/>
						</a>
					</li>
					<li>
						<a href="#">
							<img src="images/kehu-2.png" onMouseOver="this.src='images/2.jpg'" onMouseOut="this.src='images/kehu-2.png'" />
						</a>
					</li>
					<li>
						<a href="#">
							<img src="images/kehu-3.png" />
						</a>
					</li>
					<li>
						<a href="#">
							<img src="images/kehu-4.png" />
						</a>
					</li>
					<li>
						<a href="#">
							<img src="images/kehu-5.png" />
						</a>
					</li>
					<li >
						<a href="#">
							<img src="images/kehu-6.png" />
						</a>
					</li>
				</ul>
				<ul class="content" style="margin-top: 40px;">
					<li style="margin-left:0px;">
						<a href="#">
							<img src="images/kehu-7.png" />
						</a>
					</li>
					<li style="margin-left:50px;">
						<a href="#">
							<img src="images/kehu-8.png" />
						</a>
					</li>
					<li style="margin-top: 8px;">
						<a href="#">
							<img src="images/kehu-9.png" />
						</a>
					</li>
					<li style="margin-top: 3px;">
						<a href="#">
							<img src="images/kehu-10.png" />
						</a>
					</li>
					<li style="margin-top: 16px;">
						<a href="#">
							<img src="images/kehu-11.png" />
						</a>
					</li>
					<li style="margin-top: 0px;">
						<a href="#">
							<img src="images/kehu-12.png" />
						</a>
					</li>
				</ul>
			</div>
			<div class="main_foot">
				<div class="foot clearfix">
					<div class="foot_logo fl">
						<a href="index.html"><img src="images/diansheLOGO.png" /></a>
						<p>设计和技术创造极致用户体验</p>
					</div>
					<div class="con fl">
						<ul class="list1">
							<h3>我们</h3>
							<li>
								<a href="#"	>服务项目</a>					
							</li>
							<li>
								<a href="#"	>关于我们</a>					
							</li>
							<li>
								<a href="#"	>新闻动态</a>					
							</li>
							<li>
								<a href="#"	>加入我们</a>					
							</li>
							<li>
								<a href="#"	>联系我们</a>					
							</li>
						</ul>
						<ul class="list1">
							<h3>案例</h3>
							<li>
								<a href="project.html"	>全部</a>					
							</li>
							<li>
								<a href="#"	>网站</a>					
							</li>
							<li>
								<a href="#"	>移动app</a>					
							</li>
							<li>
								<a href="#"	>桌面软件</a>					
							</li>
							<li>
								<a href="#"	>品牌及平面</a>					
							</li>
						</ul>
						<ul class="list1">
							<h3>方案</h3>
							<li>
								<a href="#"	>移动互联网</a>					
							</li>
							<li>
								<a href="#"	>在线金融</a>					
							</li>
							<li>
								<a href="#"	>传统企业转型</a>					
							</li>
							<li>
								<a href="#"	>医疗健康</a>					
							</li>
							<li>
								<a href="#"	>创业服务</a>					
							</li>
						</ul>
						<ul class="list1">
							<h3>发现</h3>
							<li>
								<a href="#"	>合作伙伴</a>					
							</li>
							<li>
								<a href="#"	>研究</a>					
							</li>
							<li>
								<a href="#"	>set point实验室</a>					
							</li>
							<li>
								<a href="#"	>留言板</a>					
							</li>
							<li>
								<a href="#"	>友情链接</a>					
							</li>
						</ul>
					</div>
					<ul class="list2 fl">
						<h3>商务合作</h3>
						<li>
							<a href="#"	>邮箱：hello@set point.cn</a>					
						</li>
						<li>
							<a href="#"	>手机：18813146300</a>					
						</li>
						<li>
							<a href="#"	>座机：（+86）010-57281080</a>					
						</li>
						<li>
							<a href="http://wpa.qq.com/msgrd?v=3&uin=643879871&site=qq&menu=yes"	>Q&nbsp;Q：94967751<img src="images/icon_10.jpg" />点击交谈</a>					
						</li>
						<li>
							<a href="#"	>地址：安徽合肥马鞍山路与南一环交叉口</a>					
						</li>
					</ul>
				</div>
				<li class="foot_bottom">
					<ul class="code">
					<li>
						<a href="javascript:void(0)" onMouseOut="hideImg()" onmouseover="showImg()"><img src="images/icon_05.png" /></a>
						<div id="wxImg"><img src="images/erweima.jpg" /></div>
					</li>
					<li>
						<a href="javascript:void(0)" onMouseOut="hideImg()" onmouseover="showImg()"><img src="images/icon_06.png" /></a>
						<div id="wxImg"><img src="images/erweima.jpg" /></div>
					</li>
					<li>
						<a href="javascript:void(0)" onMouseOut="hideImg()" onmouseover="showImg()"><img src="images/icon_07.png" /></a>
						<div id="wxImg"><img src="images/erweima.jpg" /></div>
					</li>
					<li>
						<a href="javascript:void(0)" onMouseOut="hideImg()" onmouseover="showImg()"><img src="images/icon_08.png" /></a>
						<div id="wxImg"><img src="images/erweima.jpg" /></div>
					</li>
					<li>
						<a href="javascript:void(0)" onMouseOut="hideImg()" onmouseover="showImg()"><img src="images/icon_09.png" /></a>
						<div id="wxImg"><img src="images/erweima.jpg"/></div>
					</li>
					</ul>
					<p>Copyright © 2014-2017 nicedesign 京ICP备15000202号-5</p>
				</div>
			</div>
		</div>
		<script>
		new Vue().$mount('#app');
	</script>
	</body>
</html>
